import QtQuick 2.0
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12

Rectangle {
    id: rectangleHeader
    height: toolHeight + titleHeight
    color: "#b1ee91"
    property int titleHeight: 40
    property int toolHeight: 140

    property var labelMsg: null

    MyMenu {
        id: myMenu
        height: titleHeight
        labelMsg: parent.labelMsg
    }

    Rectangle {
        id: rectangleToolbar
        height: titleHeight
        border.width: 0
        anchors.left: myMenu.right
        anchors.leftMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0

        TabBar {
            x:50
            width: 238
            height: titleHeight
            anchors.horizontalCenter: parent.horizontalCenter
            id: tabBar
            currentIndex: swipeView.currentIndex

            anchors.left: toolBar1.right
            TabButton {
                id: productButton
                text: ""
                //text: qsTr("💐")
                autoExclusive: true
                focusPolicy: Qt.StrongFocus
                display: AbstractButton.TextBesideIcon
                checked: true
                anchors.verticalCenter: parent.verticalCenter
                Text {
                    id: productButtontext
                    text: qsTr("Product")
                    color:productButton.checked ? "#efeff2":"#black"
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter
                }
                background: Rectangle{
                    id: rectangle
                    width: 70
                    height: 30
                    color: productButton.checked ? "blue":"#ffffff"
                    radius: 20
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter

                }

            }
            TabButton {
                //text: qsTr("🌸")
                id: partButton
                text:""
                layer.enabled: false
                layer.format: ShaderEffectSource.RGBA
                checked: false
                Text {
                    id: partButtontext
                    text: qsTr("Part")
                    color:partButton.checked ? "#efeff2":"#black"
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter
                }
                anchors.verticalCenter: parent.verticalCenter
                background: Rectangle{
                    width: 70
                    height: 30
                    color: partButton.checked ? "blue":"#ffffff"
                    radius: 20
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter
                    //color: enBtn.checked ? "#32AAE6" : "#205068";
                    // color:

                }
            }
            TabButton {
                //text: qsTr("💮")
                id:drawingButton
                text:""
                anchors.verticalCenter: parent.verticalCenter
                Text {
                    id: drawingButtontext
                    text: qsTr("Drawing")
                    color:drawingButton.checked ? "#efeff2":"#black"
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter
                }
                background: Rectangle{
                    width: 70
                    height: 30
                    color: drawingButton.checked ? "blue":"#ffffff"
                    radius: 20
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter

                }
            }

            Button{
                text: "Button1"
                checkable: false
                checked: false
            }
        }
    }

    SwipeView {
        id: swipeView
        x: 0
        y: titleHeight
        width: parent.width
        height: toolHeight
        wheelEnabled: true
        currentIndex: tabBar.currentIndex
        clip:true
        visible: true
        Page1 {
        }


        Page2 {
        }

        Page3 {
        }
    }
}
